<!DOCTYPE html>
<html lang="zh_CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图书列表</title>
    <link rel="stylesheet" href="/BooksSystem/admin/css/main.css">
    <link rel="stylesheet" href="/BooksSystem/admin/css/font-awesome.min.css">
    <script src="/BooksSystem/admin/js/jquery-3.6.0.min.js"></script>
</head>

<body>
    <div class="main">
        <!-- 顶部导航条 -->
        <div class="top_bar">
            <div class="user">
                <div>
                    <span>当前用户：admin</span>
                    <i class="fa fa-angle-down"></i>
                    <ul>
                        <li><a href="">关于我</a></li>
                        <li><a href="">退出登录</a></li>
                    </ul>
                </div>

            </div>
        </div>
        <!-- 侧边菜单栏 -->
        <div class="left_bar">
            <div class="log">
                <img src="/BooksSystem/admin/images/log.png" alt="后台管理">
                <span>后台管理</span>
            </div>
            <div class="menu">
                <ul class="accordion">
                    <li>
                        <label><i id="menu_log" class="fa fa-home"></i><a href="">首页</a></i></label>
                    </li>
                    <li>
                        <input type="radio" name="item" id="item">
                        <label for="item"><i id="menu_log" class="fa fa-home"></i>管理员管理<i id="direction"
                                class="fa fa-angle-down"></i></label>
                        <ol>
                            <li>
                                <a href="">管理员列表</a>
                            </li>
                            <li>
                                <a href="">下方授权id</a>
                            </li>

                        </ol>
                    </li>
                    <li>
                        <label><i id="menu_log" class="fa fa-home"></i><a href="">用户管理</a></label>
                    </li>
                    <li>
                        <label><i id="menu_log" class="fa fa-home"></i><a href="">关于我</a></label>
                    </li>
                </ul>
            </div>
            <script>
                $("input[type='radio']").on('click', function () {
                    const radioId = $(this)[0].id;
                    if (($(this).data('ischecked') === true) && (window.radioId === radioId)) {
                        $(this).prop('checked', false);
                        $(this).data('ischecked', false);

                    } else {
                        $(this).prop('checked', true);
                        $(this).data('ischecked', true);
                    }
                    window.radioId = radioId;
                });
            </script>
        </div>
        <!-- 右侧内容栏 -->
        <div class="right_main">
            <link rel="stylesheet" href="/BooksSystem/admin/css/book_info.css">
            <div class="book_info">
                <h1>图书详情列表</h1>
                <div class="search">
                    <input type="button" value="添加" class="add_book">
                    <select>
                        <option value="0">全部</option>
                        <option value="1">书名</option>
                        <option value="2">编号</option>
                        <option value="3">作者</option>
                    </select>
                    <input type="text" placeholder="请输入..." autocomplete="off" class="search_text"><input type="button" value="搜索" class="search_btn">
                </div>
                <table>
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>书名</th>
                            <th>作者</th>
                            <th>出版商</th>
                            <th>出版日期</th>
                            <th>总数</th>
                            <th>剩余数量</th>
                            <th>管理</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                        <tr>
                            <td>00000001</td>
                            <td>00000002</td>
                            <td>00000003</td>
                            <td>00000004</td>
                            <td>00000005</td>
                            <td>00000006</td>
                            <td>00000007</td>
                            <td>
                                <input type="button" value="修改">
                                <input type="button" value="删除">
                            </td>
                        </tr>
                    </tbody>
                </table>
                <div class="page">
                    <input type="button" value="上一页" class="prev_page"><input type="button" value="1"
                        class="number"><input type="button" value="2" class="number"><input type="button" value="3"
                        class="number"><input type="button" value="4" class="number"><input type="button" value="5"
                        class="number"><input type="button" value="6" class="number"><input type="button" value="7"
                        class="number"><input type="button" value="8" class="number"><input type="button" value="下一页"
                        class="next_page"><span>共xxx页,到第</span><input type="text"
                        class="targetPage"><span>页</span><input type="button" value="确定" class="ok">
                </div>
            </div>
        </div>
        <!-- 页脚 -->
        <div class="footer">
            <div>
                <a href="http://ten-fei.gitee.io" target="_blank">
                    © 2021 OuYang-TengFei Copyright
                </a>
            </div>
        </div>
    </div>
</body>

</html>